<!DOCTYPE html>
<html xmlns:th="http://www.thymeleaf.org">
<head>
    <meta http-equiv="Content-Type" content="text/html; charset=UTF-8"/>
    <title></title>
</head>
<body>

<!--页面内容开始-->
<div class="wrapper wrapper-content animated fadeInRight">
    <div class="row">
        <div class="col-12">
            <div class="ibox ">
                <div class="ibox-title">
                    <h5>预算列表</h5>
                </div>
                <div class="ibox-content">
                    <div class="row">
                        <div class="col">
                            <div id="moneyinfo_table_toolbar" style="margin: 0;">
                                <form role="form" id="moneyinfo_form" class="form-inline">
                                    <div class="form-group m-r-xs">
                                        <label for="moneyinfo_moneyTypeCode" class="sr-only">经费类型</label>
                                        <select class="form-control" id="moneyinfo_moneyTypeCode"
                                                name="moneyTypeCode">
                                            <option value="">-- 请选择 --</option>
                                            <option value="001">直接支付</option>
                                            <option value="002">授权支付</option>
                                            <option value="003">自有资金</option>
                                        </select>
                                    </div>
                                    <div class="form-group m-r-xs">
                                        <label for="moneyinfo_key" class="sr-only">预算项目</label>
                                        <input type="text" class="form-control" id="moneyinfo_key"
                                               name="key" placeholder="预算项目/经济分类">
                                    </div>
                                    <div>
                                        <button class="btn btn-primary" type="button"
                                                onclick="moneyinfoObj.refreshTable()">查询
                                        </button>
                                        <button class="btn btn-white" type="button"
                                                onclick="moneyinfoObj.resetTable()">重置
                                        </button>
                                        <button class="btn btn-warning" type="button"
                                                onclick="moneyinfoObj.expertTable()">
                                            <i class="fa fa-download"></i> 导出
                                        </button>
                                    </div>
                                </form>
                            </div>
                            <table id="moneyinfo_table" class="table table-striped"></table>
                        </div>
                    </div>
                </div>
            </div>
        </div>
    </div>
</div>
<!--弹窗：经费暂停-->
<div th:replace="web/money/cur/moneyinfo-suspended::moneyinfoSuspended"></div>
<!--弹窗：经费暂停列表-->
<div th:replace="web/money/cur/moneyinfo-suspended-list::moneyinfoSuspendedList"></div>
<!--弹窗：经费冻结-->
<div th:replace="web/money/cur/moneyinfodetailfreezs-apply::moneyinfoetailfreezsApply"></div>

<script type="text/javascript">
    $().ready(function () {
        moneyinfoObj.initTable()
    })
    var moneyinfoObj = new Object({
        myTable: undefined,
        selectRow: undefined,
        refreshTable: function () {
            $('#moneyinfo_table').bootstrapTable("refresh");
        },
        resetTable: function () {
            $('#moneyinfo_form')[0].reset();
            this.refreshTable();
        },
        expertTable: function () {
            $('#moneyinfo_table').tableExport({
                type: 'excel',
                fileName: '经费导出'
            });
        },
        suspendedHandler(row){
            this.selectRow = row;
            moneyinfoSuspendedObj.init();
        },
        initTable: function () {
            this.myTable = $('#moneyinfo_table').bootstrapTable({
                toolbar: "moneyinfo_table_toolbar",
                exportDataType: "",
                exportTypes: ['excel'],
                exportOptions: {
                    fileName: function () {
                        return '预算导出'
                    }
                },
                formatNoMatches: function () {  //没有匹配的结果
                    return '暂无数据';
                },
                method: 'post',
                queryParams: function (param) {
                    param.moneyTypeCode = $("#moneyinfo_moneyTypeCode").val();
                    param.key = $('#moneyinfo_key').val();
                    return param;
                },
                url: "/money/cur/moneyinfo/querySumDetail",
                columns: [{
                    title: '#',
                    align: 'center',
                    width: 50,
                    formatter: function (value, row, index) {
                        return index + 1;
                    }
                }, {
                    title: '经费类型',
                    field: 'moneyTypeName'
                }, {
                    title: '预算项目',
                    field: 'projectName',
                    formatter: function (value, row, index) {
                        return value + `(${row.projectCode})`;
                    }
                }, {
                    title: '经济分类',
                    field: 'cateName',
                    formatter: function (value, row, index) {
                        return value + `(${row.cateCode})`;
                    }
                }, {
                    title: '计划金额',
                    field: 'totalMoney',
                    formatter: function (value, row, index) {
                        return $.moneyFormat(value);
                    }
                }, {
                    title: '暂停金额',
                    field: 'totalMoneyFreezs',
                    formatter: function (value, row, index) {
                        let num = $.moneyFormat(value);
                        return `<a class="totalMoneyFreezs text-success" href="javascript:">${num}</a>`;
                    },
                    events: {
                        'click .totalMoneyFreezs': function (e, value, row, index) {
                            moneyinfoObj.selectRow = row;
                            moneyinfoSuspendedListObj.init();
                        }
                    }
                }, {
                    title: '冻结金额',
                    field: 'freezsMoney',
                    formatter: function (value, row, index) {
                        return `<a class="frzzse text-success" href="javascript:">${$.moneyFormat(value)}</a>`;
                    },
                    events: {
                        'click .frzzse': function (e, value, row, index) {
                            moneyinfoetailfreezsApplyObj.init(row.id);
                        }
                    }
                }, {
                    title: '支付金额',
                    field: 'useMoney',
                    formatter: function (value, row, index) {
                        return $.moneyFormat(value);
                    }
                }, {
                    title: '可用金额',
                    field: 'availableMoney',
                    formatter: function (value, row, index) {
                        return $.moneyFormat(value);
                    }
                }, {
                    title: '操作',
                    width: 200,
                    events: {
                        'click .suspended': function (e, value, row, index) {
                            moneyinfoObj.suspendedHandler(row)
                        }
                    },
                    formatter: function (value, row, index) {
                        var opers = [];
                        opers.push(`<a class="suspended btn btn-white btn-bitbucket text-success" data-toggle="tooltip" data-placement="top" title="添加暂停">
                                    <i class="fa fa-suitcase"></i>
                                </a>`)
                        return opers.join('');
                    }
                }],
                responseHandler: function (res) {
                    return res.sumDetail;
                },
                onDblClickRow: function (row, $element, field) {

                }
            });
        },
        initFreezsTable: function () {
            $('#budgetSum_freezs_table').bootstrapTable({
                showExport: true,
                exportDataType: "",
                exportTypes: ['excel'],
                exportOptions: {
                    fileName: function () {
                        return '预算冻结导出'
                    }
                },
                formatNoMatches: function () {  //没有匹配的结果
                    return '暂无数据';
                },
                method: "post",
                columns: [{
                    title: '#',
                    align: 'center',
                    width: 50,
                    formatter: function (value, row, index) {
                        return index + 1;
                    }
                }, {
                    title: '预算部门',
                    field: 'deptName'
                }, {
                    title: '预算项目',
                    field: 'projectName'
                }, {
                    title: '经济分类',
                    field: 'cateName'
                }, {
                    title: '冻结金额',
                    field: 'money',
                    formatter: function (value, row, index) {
                        return $.moneyFormat(value);
                    }
                }, {
                    title: '单据号',
                    field: 'processCode'
                }],
                responseHandler: function (res) {
                    return res.data;
                }
            });
        }
    })

</script>
</body>
</html>